@using Umbraco.Cms.Core.Hosting
@using Umbraco.Cms.Core.Routing
@inject IHostingEnvironment HostingEnvironment
@{
    var backOfficePath = HostingEnvironment.GetBackOfficePath();
}
<!doctype html>
<html class="no-js" lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

    <title>Page Not Found</title>

    <link rel="stylesheet" href="@WebPath.Combine(backOfficePath, "website", "/nonodes.css")" />
    <style type="text/css">
        body {
            color:initial;
        }

        section {
            background: none;
        }

        section a, section a:focus, section a:visited {
            color:initial;
            border-color:currentColor;
        }
    </style>
</head>
<body>

    <section>
        <article>
            <div>
                <h1>Page Not Found</h1>
                @if (HostingEnvironment.IsDebugMode)
                {
                    var reason = (string?)Context.Items["reason"];
                    var message = (string?)Context.Items["message"];

                    if (!string.IsNullOrWhiteSpace(reason))
                    {
                        <h3>@reason</h3>
                    }
                    if (!string.IsNullOrWhiteSpace(message))
                    {
                        <p>@message</p>
                    }

                    <div class="cta"></div>

                    <div class="row">
                        <div class="col">
                            <h2>This page can be replaced</h2>
                            <p>
                                Custom error handling might make your site look more on-brand and minimize the impact of errors on user experience - for example, a custom 404 with some helpful links (or a search function) could bring some value to the site.
                            </p>

                            <a href="https://umbra.co/custom-error-pages" target="_blank" rel="noopener">Implementing custom error pages &rarr;</a>
                        </div>

                        <div class="col">
                            <h2>The Umbraco community forum</h2>
                            <p>The forum is the central hub for the Umbraco developer community. This is where developers, integrators, and contributors come together to ask questions, share knowledge, and collaborate on all things Umbraco.</p>

                            <a href="https://forum.umbraco.com/" target="_blank" rel="noopener">Umbraco community forum &rarr;</a>
                        </div>
                    </div>

                }
            </div>
        </article>

    </section>

</body>
</html>
